<script setup>
  // 导入pinia数据
  import { definePerson } from '../store/store';

  let person = definePerson()

</script>

<template>
  <div>
    <h1>修改pinia数据</h1>
    名字：<input type="text" v-model="person.userName"><br>
    年龄：<input type="text" v-model="person.age">
    爱好：
      吃饭<input type="checkbox" v-model="person.hobbies" value="吃饭">
      睡觉<input type="checkbox" v-model="person.hobbies" value="睡觉">
      打豆豆<input type="checkbox" v-model="person.hobbies" value="打豆豆">
      唱歌<input type="checkbox" v-model="person.hobbies" value="唱歌">
      跳舞<input type="checkbox" v-model="person.hobbies" value="跳舞">
    年龄：{{ person.getAge }}
    <hr>
    <button @click="person.doubleAge()">年龄加倍</button><br>
    <button @click="person.$reset()">所有属性恢复默认值</button><br>
    <button @click="person.$patch({userName: 'haha', age: '3', hobbies: ['打架', '喝酒']})">一键设置多个值</button><br>
    <hr>
    展示person中的数据：{{ person }}
  </div>
  
</template>

<style scoped>

</style>
